import router from '@/router'
import store from '@/store'
import axios from 'axios'
import { Message } from 'element-ui'

const service = axios.create({
  /**
   * * process.env 是nodejs内置的固定环境变量对象
   * ? npm run dev -> 启动开发服务，项日根日录 .env.development 环境变量配置文件里值添加到 process.env 对象上
   * ? npm run build:prod -> 启动打包，项目根目录 .env.production 环境变量配置文件里值添加到 process.env 对象上

   */
  baseURL: process.env.VUE_APP_BASE_API,
  timeout: 5000
})

service.interceptors.request.use(
  config => {
    const token = store.getters.token
    if (token && config.url !== '/api/sys/login') { config.headers['Authorization'] = `Bearer ${token}` }
    return config
  },
  error => {
    return Promise.reject(error)
  }
)

service.interceptors.response.use(
  response => {
    const { success, message } = response.data
    // 因为后台成功/失败状态码都是200，所以用 success 字段区分
    return success ? response.data : Message.error(message)
  },
  error => {
    Message.error((error?.response?.data?.message) || error.message)
    /**
     * * 10002 代表 token 过期
     * ! ?. 新版语法，需要 babel 支持才能使用
     * ? 左侧有值才会继续 .属性，防止空值报错
     */
    if (error?.response?.data?.code === 10002) {
      store.dispatch('user/logoutActions')
      router.replace(('/login'))
    }
    return Promise.reject(error)
  }
)

export default service
